import userApi from '@/services/user';
import { PageContainer } from '@ant-design/pro-components';
import { useNavigate } from '@umijs/max';
import { message } from 'antd';
import { useState } from 'react';
import UserForm from './components/userForm';

const AddUser = () => {
  const [userInfo, setUserInfo] = useState({
    loginId: '',
    loginPwd: '',
    avatar: '',
    nickname: '',
    mail: '',
    qq: '',
    wechat: '',
    intro: '',
  });
  const navigate = useNavigate();
  const [messageApi, contextHolder] = message.useMessage();

  const setNewUserInfo = (newInfo) => {
    setUserInfo(newInfo);
  };
  const submitHandle = async () => {
    const resp = await userApi.addUser(userInfo);
    if (resp.data) {
      messageApi.open({
        type: 'success',
        content: '新增用户成功！',
      });
      setTimeout(() => {
        navigate('/user/userList');
      }, 2000);
    } else {
      messageApi.open({
        type: 'error',
        content: resp.msg,
      });
    }
  };

  return (
    <div>
      <PageContainer>
        <div className="container" style={{ width: '800px' }}>
          <UserForm
            type="add"
            userInfo={userInfo}
            setUserInfo={setNewUserInfo}
            submitHandle={submitHandle}
          />
        </div>
      </PageContainer>
      {contextHolder}
    </div>
  );
};

export default AddUser;
